<template>
  <view>
    <view class="container">
      <video
          :autoplay="true"
          class="video"
          :controls="true"
          :direction="0"
          playBtnPosition="center"
          :poster="poster"
          :showCenterPlayBtn="true"
          :src="video_url"
      ></video>
      <view class="footer" v-if="down">
        <!-- #ifdef WEB -->
        <button @tap="webDownloadFile" class="confirm-btn" :plain="true">复制视频链接</button>
        <!-- #endif -->
        <!-- #ifndef WEB -->
        <button @tap="downloadFile" class="confirm-btn" :plain="true">下载视频</button>
        <!-- #endif -->
      </view>
    </view>
  </view>

</template>

<script>
import fileSaver from 'file-saver'
export default {
  data() {
    return {
      zuopin_id: 0,
      video_url: '',
      poster: '',
      down: 0
    };
  },
  onLoad(options) {
    this.video_url = options.video_url;
    this.poster = options.poster;
    this.down = options.down ? 1 : 0;
    if (options.zuopin_id) {
      this.zuopin_id = parseInt(options.zuopin_id)
    }
  },
  methods: {
    downloadFile() {
      // #ifndef WEB
      var that = this
      uni.showLoading({
        title: '下载中'
      });
      uni.downloadFile({
        url: this.video_url,
        success: function (res) {
          if (res.statusCode === 200) {
            uni.saveVideoToPhotosAlbum({
              filePath: res.tempFilePath,
              success: function () {
                that.$util.message('已保存到相册', 'success')
              }
            });
          }
        },
        complete: function () {
          uni.hideLoading();
        }
      });
      // #endif
      // #ifdef WEB
      this.webDownloadFile();
      // #endif
    },
    webDownloadFile() {

      if (this.zuopin_id) {
        uni.showLoading({
          title: '下载中',
          mask: true
        })
        const app = getApp();
        const url = app.globalData.siteinfo.host + '/api.php/h5/downloadVideo?site_id=' + window.site_id +'&id=' + this.zuopin_id + '&token=' + uni.getStorageSync('token');
        const fileName = this.video_url.split('/').pop();
        fileSaver.saveAs(url, fileName)
        setTimeout(() => {
          uni.hideLoading()
        }, 3000)
        /*const a = document.createElement('a');
        a.setAttribute('href', url);
        a.setAttribute('download', fileName);
        a.setAttribute('target', '_blank');
        const clickEvent = document.createEvent('MouseEvents');
        clickEvent.initEvent('click', true, true);
        a.dispatchEvent(clickEvent);*/
      } else {
        this.copyText(this.video_url);
      }
    },
    copyText(text) {
      const that = this
      uni.setClipboardData({
        data: text,
        showToast: false,
        success: function () {
          that.$util.message('复制成功', 'error');
        },
        fail: function () {
          that.$util.message('复制失败，请检查是否已开启剪切板权限：' + text, 'error');
        }
      })
    }
  }
}
</script>
<style scoped>
@import './video-play.css';
</style>
